<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>viewOneProduct</title>
</head>
<link rel="stylesheet" type="text/css" href="css/main.css" />
<link rel="stylesheet" type="text/css" href="css/imgSlider.css" />
<script type='text/javascript' src='js/prototype.js'></script>
<script type='text/javascript' src='js/sha1.js'></script>
<script type='text/javascript' src='js/imgSlider.js'></script>
<script type='text/javascript'>
	function iteratorTags(){
		var params="max=5&first=0";
		new Ajax.Request("json/iteratorTags", {
			method : "post",
			parameters : params,
			onComplete : function(request) {
				document.getElementById("tagDisplayer").innerHTML = "热门检索标签：";
				var res = request.responseText.evalJSON();
				for(var i=0;null!=res["result"]["product_tagName"+i];i++){
					document.getElementById("tagDisplayer").innerHTML+=
						"<a href='viewOneTag.html?tagNameId="+res["result"]['product_tagNameId'+i]+"'>"
						+res["result"]["product_tagName"+i]
						+"</a>&nbsp;";
				}
			},
			asynchronous : true
		});
	}
	function viewOneProductTags(productId){
		var params = "productId=" + productId;
		new Ajax.Request("json/viewOneProductTags", {
			method : "post",
			parameters : params,
			onComplete : function(request) {
				var res = request.responseText.evalJSON();
				if (res["result"]["flag"] == "true") {
					document.getElementById("tags").innerHTML="标签：";
					for(var i=0;res["result"]["product_tagName"+i];i++)
						document.getElementById("tags").innerHTML+="&nbsp;"+res["result"]["product_tagName"+i];
				}
			},
			asynchronous : false
		});
	}
	function viewOneProduct() {
		var request = {
			QueryString : function(val) {
				var uri = window.location.search;
				var re = new RegExp("" + val + "=([^&?]*)", "ig");
				return ((uri.match(re)) ? (uri.match(re)[0]
						.substr(val.length + 1)) : null);
			}
		};
		var productId = request.QueryString("productId");
		var params = "productId=" + productId;
		new Ajax.Request(
				"json/viewOneProduct",
				{
					method : "post",
					parameters : params,
					onComplete : function(request) {
						var res = request.responseText.evalJSON();
						if (res["result"]["flag"] == "true") {
							document.getElementById("image1").src = res["result"]["image1"];
							document.getElementById("image2").src = res["result"]["image2"];
							document.getElementById("image3").src = res["result"]["image3"];
							document.getElementById("image4").src = res["result"]["image4"];
							document.getElementById("image5").src = res["result"]["image5"];

							document.getElementById("amount").innerHTML = "数量:"
								+ res["result"]["amount"];
							document.getElementById("price").innerHTML = "价格:"
									+ res["result"]["price"];
							document.getElementById("name").innerHTML = "名称:"
									+ res["result"]["name"];
							document.getElementById("content").innerHTML = "描述：<br/>"
									+ res["result"]["description"];
							viewOneProductTags(productId);
						}
					},
					asynchronous : false
				});
		imgSliderInitialization();
		online();
	}
	function online() {
		var params = "";
		new Ajax.Request("json/online", {
			method : "post",
			parameters : params,
			onComplete : function(request) {
				var res = request.responseText.evalJSON();
				document.getElementById("online").innerHTML = "当前在线人数："
						+ res["result"]["online"];
			},
			asynchronous : true
		});
		iteratorTags();
	}
</script>
<body onload="viewOneProduct()">
	<div class="topbar">
		<ul class="horizon">
			<li style="margin-left: 50%; margin-top: 2px;" class="logo"><a
				href="login.html">首页</a> <a href="productOwner.html">店主页面</a></li>
			<li class="login" id="login"><li class="login" id="login">
				<ul class="vertical" style="margin-left:80px">
			<li class="userInfo"><img src="image/userPhoto.png" /><a>&nbsp;你好，用户</a></li>
			<li class="userInfo2">
				<ul class="horizon">
					<li style="margin-right:15px;"><img
								src="image/userPhotoBig.png" /></li>
					<li>用户&nbsp;&nbsp;&nbsp;&nbsp;<a>修改密码</a><br />编辑个人资料<br />注销<br /></li>
				</ul>
			</li>
		</ul>
	</li>
			
		</ul>
	</div>
	<div class="main">
		<ul class="horizon">
			<li>
				<ul class="vertical">
					<li class="managePad">
						<ul class='vertical' style="margin-left: 60px;">
						<li id="online" style="top:80%;position:absolute"></li>
						<li id="tagDisplayer"></li>
						</ul>
					</li>
				</ul>
			
			<li class="content" style="position: relative">
				<ul class='vertical'>
					<li>
					<ul class='horizon'>
						<li id="slider">
							<ol class="player">
								<li><a href=""><img src="" alt="1" id="image1" /></a></li>
								<li><a href=""><img src="" alt="2" id="image2" /></a></li>
								<li><a href=""><img src="" alt="3" id="image3" /></a></li>
								<li><a href=""><img src="" alt="4" id="image4" /></a></li>
								<li><a href=""><img src="" alt="5" id="image5" /></a></li>
							</ol>
							<ol class="btns">
								<li>1</li>
								<li>2</li>
								<li>3</li>
								<li>4</li>
								<li>5</li>
							</ol>
							</li>
						<li style="position:absolute;margin-left:500px;margin-top:100px;"><ul
									class='vertical'>
								<li id="name"></li>
								<li id="price"></li>
								<li id="amount"></li>
								<li id="tags"></li>
							</ul></li>
					</ul>
					</li>
					<li id="content"
						style="position: absolute; margin-top: 300px;margin-left:20px"></li>
				</ul>
			</li>
		</ul>
	</div>
</body>
</html>